<template>
  <div>
    <IndexHeader></IndexHeader>
    <DetailMain :productId="productId" :product="product" :productImgs="productImgs" :productSkus="productSkus" :productParams="productParams"></DetailMain>
    <IndexTip></IndexTip>
  </div>
</template>

<script>
import IndexHeader from "@/components/index/IndexHeader";
import DetailMain from "@/components/detail/DetailMain";
import IndexTip from "@/components/index/IndexTip";
import {getProductDetail,getProductParams} from '@/api/detail.js'
export default {
  name: "Detail",
  components: {IndexHeader,DetailMain,IndexTip},
  data(){
    return{
      productId:'',
      product:{},
      productImgs:[],
      productSkus:[],
      productParams: {}
    }
  },
  created() {
    //接收产品id
    this.productId=this.$route.query.pid;
    getProductDetail(this.productId).then(data=>{
      const res=data.data;
      //console.log(JSON.stringify(res))
      if(res.success){
        const map=res.data;
        this.product=map.product;
        console.log('主页'+JSON.stringify(this.product))
        this.productImgs=map.productImgs;
        // console.log('主页'+JSON.stringify(this.productImgs))
        this.productSkus=map.productSkus;
        // console.log(JSON.stringify(this.productSkus))
      }else {
        this.$message({message: res.msg, type: 'warning', showClose: true})
      }
    }
    ).catch(
      error=>{
        this.$message(error)
      }
    );




  }
}
</script>
<style scoped>
@import "../assets/css/demo.css";
@import "../assets/css/optstyle.css";
@import "../assets/css/style.css";

</style>